<template>
  <div class="content">
    <p v-if="result" style="color:red;">初审拒绝原因: {{result}}</p>
    <a-form @submit="handleSubmit" style="margin-top: 8px;" :form="form">
      <div class="baseInfo" v-if="docking">
        <a-row class="row-sty">
          <a-col :xs="{ span : 24 }" :sm="{ span:7 }" class="formGroupTitle">基本信息</a-col>
        </a-row>
        <a-form-item v-bind="formItemLayout1" label="企业性质">
          <a-select style=" width: 50%;" v-decorator="[
                        'orgType',
                        {
                            rules: [{
                            required: true, message: '请选择企业性质',
                            }],
                        }
                        ]">
            <a-select-option v-for="d in seloptions" :key="d.value">{{d.text}}</a-select-option>
          </a-select>
        </a-form-item>
        <a-form-item v-bind="formItemLayout1" label="商户类别">
          <a-cascader style="width: 60%;" v-decorator="[
                      'mcc',
          {rules: [{ required: true, message: '请选择商户类别' }]}
                    ]" :options="mccoptions" @change="handleChange" placeholder="请选择商户类别"   />

          <!-- :fieldNames="{ label: 'name', value: 'code', children: 'children' }" -->
        </a-form-item>
        <a-form-item :label-col="{  xs: { span: 24 },
          sm: { span: 3 } }" :wrapper-col="{ xs: { span: 24 },
          sm: { span: 12,offset:1 },
          md: { span: 16,offset:1 } }" label="经营商品类别">
          <a-checkbox-group v-decorator="['orgProductTypes',                        {
                            rules: [{
                            required: true, message: '请选择经营商品类别',
                            }],
                        }]" style="width: 100%;" @change="categoryChange">
            <a-row>
              <a-col :span="4">
                <a-checkbox value="org_product_type_001">实物类</a-checkbox>
              </a-col>
              <a-col :span="20">
                <a-checkbox value="org_product_type_003">储值卡，礼品券，游戏点卡，充值会员，报刊杂志订阅类，旅游服务类等虚拟类</a-checkbox>
              </a-col>
              <a-col :span="24">
                <a-checkbox value="org_product_type_002">
                  其他虚拟类
                  <a-input v-if="iscategory" style="display:inline-block;width: 60%;margin-top: 4px;" disabled
                    placeholder="" />
                  <a-input v-if="!iscategory" style="display:inline-block;width: 60%;margin-top: 4px;"
                    placeholder=" " />
                </a-checkbox>
              </a-col>
            </a-row>
          </a-checkbox-group>
        </a-form-item>
        <a-form-item v-bind="formItemLayout1" label="经营场所">
          <a-radio-group v-decorator="[
                        'placeRight',
                        {
                            rules: [{
                            required: true, message: '请选择经营场所是否自有或租赁',
                            }]
                        }
                        ]" @change="onChange">
            <a-radio value="place_right_001">自有</a-radio>
            <a-radio value="place_right_002">租赁</a-radio>
          </a-radio-group>
        </a-form-item>
        <a-form-item v-bind="formItemLayout1" label="经营场所面积">
          <a-select style=" width: 50%;" v-decorator="[
                        'placeArea',
                        {
                            rules: [{
                            required: true, message: '请选择',
                            }],
                        }
                        ]" placeholder="请选择">
            <a-select-option v-for="d in areaoptions" :key="d.value">{{d.text}}</a-select-option>
          </a-select>
        </a-form-item>
        <a-form-item v-bind="formItemLayout1" label="员工人数">
          <a-select style=" width: 50%;" v-decorator="[
                        'orgEmployees',
                        {
                            rules: [{
                            required: true, message: '请选择',
                            }],
                        }
                        ]" placeholder="请选择">
            <a-select-option v-for="d in numoptions" :key="d.value">{{d.text}}</a-select-option>
          </a-select>
        </a-form-item>
      </div>

      <a-row class="ant-advanced-search-form" :gutter="24">
        <a-col :span="8">
          <a-row class="row-sty">
            <a-col :xs="{ span : 24 }" :sm="{ span:10 }" class="formGroupTitle">业务联系人</a-col>
          </a-row>
          <a-form-item v-bind="formItemLayout" label="姓名">
            <a-input v-decorator="[
                      'businessName',
                      {rules: [{ required: true, message: '请输入姓名' }]}
                    ]" placeholder="请输入姓名" />
          </a-form-item>
          <a-form-item v-bind="formItemLayout" label="联系电话">
            <a-input v-decorator="[
                            'businessphone',
                            {
                             rules: [{ required: true, message: '请输入联系电话!' },{validator: validateCode}],validateTrigger: 'blur'
                            }
                            ]" placeholder="请输入联系电话" />
          </a-form-item>
          <a-form-item v-bind="formItemLayout" label="Email">
            <a-input v-decorator="[
                            'businessemail', { rules: [{type: 'email', message: '请输入有效邮箱地址!', }, {required: true, message: '请输入邮箱地址!',},{validator: validatemail}],validateTrigger: 'blur'}
                            ]" placeholder="请输入Email" />
          </a-form-item>
        </a-col>

        <div v-if="docking">
          <a-col :span="8">
            <a-row class="row-sty">
              <a-col :xs="{ span : 24 }" :sm="{ span:10 }" class="formGroupTitle">技术联系人</a-col>
            </a-row>
            <a-form-item v-bind="formItemLayout" label="姓名">
              <a-input v-decorator="[
                      'techName',
                      {rules: [{ required: true, message: '请输入姓名' }]}
                    ]" placeholder="请输入姓名" />
            </a-form-item>
            <a-form-item v-bind="formItemLayout" label="联系电话">
              <a-input v-decorator="[
                            'techphone',
                            {
                             rules: [{ required: true, message: '请输入联系电话!' },{validator: validateCode}],validateTrigger: 'blur'
                            }
                            ]" placeholder="请输入联系电话" />
            </a-form-item>
            <a-form-item v-bind="formItemLayout" label="Email">
              <a-input v-decorator="[
                            'techemail', { rules: [{type: 'email', message: '请输入有效邮箱地址!', }, {required: true, message: '请输入邮箱地址!',},{validator: validatemail}],validateTrigger: 'blur'}
                            ]" placeholder="请输入Email" />
            </a-form-item>
          </a-col>
          <a-col :span="8">
            <a-row class="row-sty">
              <a-col :xs="{ span : 24 }" :sm="{ span:10 }" class="formGroupTitle">财务联系人</a-col>
            </a-row>
            <a-form-item v-bind="formItemLayout" label="姓名">
              <a-input v-decorator="[
                      'richName',
                      {rules: [{ required: true, message: '请输入姓名' }]}
                    ]" placeholder="请输入姓名" />
            </a-form-item>
            <a-form-item v-bind="formItemLayout" label="联系电话">
              <a-input v-decorator="[
                            'richphone',
                            {
                             rules: [{ required: true, message: '请输入联系电话!' },{validator: validateCode}],validateTrigger: 'blur'
                            }
                            ]" placeholder="请输入联系电话" />
            </a-form-item>
            <a-form-item v-bind="formItemLayout" label="Email">
              <a-input v-decorator="[
                            'richemail', { rules: [{type: 'email', message: '请输入有效邮箱地址!', }, {required: true, message: '请输入邮箱地址!',},{validator: validatemail}],validateTrigger: 'blur'}
                            ]" placeholder="请输入Email" />
            </a-form-item>
          </a-col>
        </div>
      </a-row>

      <a-row class="row-sty">
        <a-col :xs="{ span : 24 }" :sm="{ span:10 }" class="formGroupTitle">
          <span style="color:red;">*</span>网站信息
          <span style="font-size:12px;color: rgba(0, 0, 0, 0.65);font-weight: 400;">请填写需要开通收款功能的渠道内容</span>
        </a-col>
        <!-- <p>请选择需要开通收款功能的网站、APP、公众号进行相应内容填写，可选择多个，但至少选择一个</p> -->
      </a-row>
      <!-- <a-row class="row-sty">
        <a-col :xs="{ span : 24 }" :sm="{ span:24 }">
          <p>请选择需要开通收款功能的网站、APP、公众号进行相应内容填写，可选择多个，但至少选择一个</p>
        </a-col>
      </a-row>-->
      <a-form-item>
        <!-- <a-checkbox-group
          v-decorator="[
                            'webchoose', { rules: [{required: true, message: '请至少选择一个网站信息!',}]}
                            ]"
          @change="webChange"
        >-->
        <a-row>
          <a-col :span="24">
            <!-- <a-checkbox
                style="font-size:16px; font-weight:600;color:rgba(0, 0, 0, 0.85);"
                value="A"
            >网站</a-checkbox>-->
            <h3 style="font-size:16px; font-weight:600;color:rgba(0, 0, 0, 0.85);margin-bottom:0;">网站</h3>
          </a-col>
          <a-row class="ant-advanced-search-form" :gutter="24">
            <a-col :span="1"></a-col>
            <a-col :span="7">
              <a-form-item v-bind="formItemLayout2" label="网站名称">
                <a-input v-decorator="[
                          'webname',
                        ]" placeholder=" " />
              </a-form-item>
            </a-col>
            <a-col :span="8">
              <a-form-item v-bind="formItemLayout2" label="网址">
                <a-input v-decorator="[
                          'weburl',{
                            rules: [{validator: validatenet}]
                          }
                        ]" placeholder=" " />
              </a-form-item>
            </a-col>
            <a-col :span="8">
              <a-form-item v-bind="formItemLayout2" label="ICP备案号">
                <a-input v-decorator="[
                          'webrecord',
                          {
                            rules: [{validator: validateicp}]
                          }
                        ]" placeholder=" " />
              </a-form-item>
            </a-col>
          </a-row>
          <a-col :span="24">
            <!-- <a-checkbox
                style="font-size:16px; font-weight:600;color:rgba(0, 0, 0, 0.85);"
                value="B"
            >APP</a-checkbox>-->
            <h3 style="font-size:16px; font-weight:600;color:rgba(0, 0, 0, 0.85);margin-bottom: 0px;">APP</h3>
          </a-col>
          <a-row class="ant-advanced-search-form" :gutter="24">
            <a-col :span="1"></a-col>
            <a-col :span="23">
              <a-form-item  :label-col="{  xs: { span: 24 },
              sm: { span: 2 } }" :wrapper-col="{ xs: { span: 24 },
              sm: { span: 8,offset:1 },
              md: { span: 5,offset:1 } }" label="APP名称">
                <a-input v-decorator="[
                          'appname',
                          {
                            rules: [],
                          }
                        ]" placeholder=" " />
              </a-form-item>
            </a-col>
            <a-col :span="1"></a-col>
            <a-col :span="23">
              <a-form-item  :label-col="{  xs: { span: 24 },
              sm: { span: 2 } }" :wrapper-col="{ xs: { span: 24 },
              sm: { span: 20,offset:1 },
              md: { span: 14,offset:1 } }" label="上线应用市场">
                <a-checkbox-group v-decorator="['appaddress']" @change="appchange" style="width: 100%;">
                  <a-row>
                    <a-col :span="4">
                      <a-checkbox value="A1">AppStore</a-checkbox>
                    </a-col>
                    <a-col :span="4">
                      <a-checkbox value="B1">360手机助手</a-checkbox>
                    </a-col>
                    <a-col :span="4">
                      <a-checkbox value="C1">应用宝</a-checkbox>
                    </a-col>
                    <a-col :span="4">
                      <a-checkbox value="D1">华为</a-checkbox>
                    </a-col>
                    <a-col :span="4">
                      <a-checkbox value="E1">小米</a-checkbox>
                    </a-col>
                    <a-col :span="4">
                      <a-checkbox value="F1">百度手机助手</a-checkbox>
                    </a-col>
                    <a-col :span="24">
                      <a-checkbox value="H1">
                        其他
                        <a-input v-if="isother" style="display:inline-block;width: 60%;margin-top: 4px;" disabled
                          placeholder=" " />
                        <a-input v-if="!isother" style="display:inline-block;width: 60%;margin-top: 4px;"
                          placeholder=" " />
                      </a-checkbox>
                    </a-col>
                  </a-row>
                </a-checkbox-group>
              </a-form-item>
            </a-col>
          </a-row>
          <a-col :span="24">
            <!-- <a-checkbox
                style="font-size:16px; font-weight:600;color:rgba(0, 0, 0, 0.85);"
                value="C"
            >微信公众号</a-checkbox>-->
            <h3 style="font-size:16px; font-weight:600;color:rgba(0, 0, 0, 0.85);margin-bottom: 0px;">微信公众号</h3>
          </a-col>
          <a-row class="ant-advanced-search-form" :gutter="24">
            <a-col :span="1"></a-col>
            <a-col :span="8">
              <a-form-item v-bind="formItemLayout2" label="公众号名称">
                <a-input v-decorator="[
                          'pubname',
                          {
                            rules: [],
                          }
                        ]" placeholder=" " />
              </a-form-item>
            </a-col>
            <a-col :span="8">
              <a-form-item v-bind="formItemLayout2" label="公众号ID">
                <a-input v-decorator="[
                          'pubID'
                        ]" placeholder=" " />
              </a-form-item>
            </a-col>
          </a-row>
        </a-row>
        <!-- </a-checkbox-group> -->
      </a-form-item>

      <div style="text-align:center;">
        <a-button class="submitButton" type="primary" html-type="submit">下一步</a-button>
      </div>
    </a-form>
  </div>
</template>
<script>
  import { message } from "ant-design-vue";
  import api from "@/common/api";
  import { error } from "util";
  import { fail } from "assert";
  export default {
    data() {
      return {
        arr: [],
        infoid: "",
        mcc: "",
        result: "",
        webchoose: [],
        docking: true,
        isother: true,
        iscategory: true,
        orgProductTypes: [],
        formItemLayout1: {
          labelCol: {
            xs: { span: 24 },
            sm: { span: 3 }
          },
          wrapperCol: {
            xs: { span: 24 },
            sm: { span: 12,offset:1 },
            md: { span: 10,offset:1 }
          }
        },
        formItemLayout2: {
          labelCol: {
            xs: { span: 24 },
            sm: { span: 6 }
          },
          wrapperCol: {
            xs: { span: 24 },
            sm: { span: 17,offset:1 },
            md: { span: 15,offset:1 }
          }
        },
        formItemLayout: {
          labelCol: {
            xs: { span: 24 },
            sm: { span: 7 }
          },
          wrapperCol: {
            xs: { span: 24 },
            sm: { span: 12,offset:1 },
            md: { span: 10,offset:1 }
          }
        },
        mccoptions: [],
        seloptions: [
          { text: "国家机关/事业单位/军队", value: "org_type_038" },
          { text: "国有企业/上市公司", value: "org_type_001" },
          { text: "股份有限公司/集体所有企业", value: "org_type_002" },
          { text: "中外合资企业", value: "org_type_003" },
          { text: "私营独资/合伙企业", value: "org_type_004" },
          { text: "个体工商户", value: "org_type_005" },
          { text: "外商独资企业", value: "org_type_006" },
          { text: "其他", value: "org_type_037" },
        ],
        areaoptions: [
          { text: "200平米以上", value: "place_area_001" },
          { text: "100-200平米(含)", value: "place_area_002" },
          { text: "50-100平米(含)", value: "place_area_003" },
          { text: "50平米以下(含)", value: "place_area_004" }
        ],
        numoptions: [
          { text: "500人以上", value: "org_employees_001" },
          { text: "100-500人(含)", value: "org_employees_002" },
          { text: "50-100人(含)", value: "org_employees_003" },
          { text: "10-50人(含)", value: "org_employees_004" },
          { text: "0-10人(含)", value: "org_employees_005" }
        ]
      };
    },
    beforeCreate() {
      this.form = this.$form.createForm(this);
    },
    created() {
      this.infoid = sessionStorage.getItem("infoid");
      let dock = sessionStorage.getItem("docking");
      if (dock == "true") {
        this.docking = true;
      } else {
        this.docking = false;
      }
      console.log("this.docking", typeof this.docking, this.docking);
    },
    mounted() {
      this.getmccData();
      this.form.setFieldsValue({
        appaddress: []
      });
      console.log(this.$route.query.modify);
      if (this.$route.query.modify) {
        console.log("修改");
        this.SpeDataModify();
      } else {
        console.log("222");
      }
    },
    methods: {
      // 商户类别获取
      getmccData() {
        this.$axios.get("/agent/mcc/list").then(res => {
          console.log("res", res);
          // const result = res.data;
          if (res.data.list) {
            let list = res.data.list;
            let arr = [];
            let newArr = list.map((item, index, list) => {
              let test = {
                label: item.categoryName,
                value: item.categoryName,
                children: []
              };
              arr.push(test);
              if (item.items) {
                let children = [];

                for (let i = 0; i < item.items.length; i++) {
                  let test2 = {
                    label: item.items[i].name,
                    value: item.items[i].mcc
                    // children: []
                  };
                  children.push(test2);
                }
                // console.log("children", children);
                arr[index]["children"] = children;
              }
              return arr;
            });
            console.log("newArr", newArr);
            this.mccoptions = newArr[0];
            console.log("this.mccoptions", this.mccoptions);
          } else {
            console.log("res", res);
          }
        });
      },
      //  特约商户基本信息修改
      SpeDataModify() {
        // const data = {
        //   type:"baseInfoKey"
        // }
        this.$axios.get('/agent/merchant/get/cache').then(
          res => {
            console.log("res", res);
            if (res.data.code == "OK") {
              let mod = res.data.data.logMerchantAddRequest;
              this.mcc = mod.mcc;
              this.result = mod.remark;
              // 网站信息三选一判断
              // if (mod.websiteName) {
              //   this.webchoose.push("A");
              // }
              // if (mod.appName) {
              //   this.webchoose.push("B");
              // }
              // if (mod.wechatPublicName) {
              //   this.webchoose.push("C");
              // }
              console.log("11111111111");
              console.log(typeof this.webchoose, this.webchoose);
              console.log(
                "mod.orgProductTypes",
                typeof mod.orgProductTypes,
                mod.orgProductTypes
              );
              this.form.setFieldsValue({
                webname: mod.websiteName,
                weburl: mod.websiteUrl,
                webrecord: mod.websiteIcp,
                appname: mod.appName,
                appaddress: mod.appMarketplaces ? mod.appMarketplaces : [],
                pubname: mod.wechatPublicName,
                pubID: mod.wechatPublicId,
                businessName: mod.contactName,
                businessphone: mod.contactPhone,
                businessemail: mod.contactEmail,
                techName: mod.techName,
                techphone: mod.techPhone,
                techemail: mod.techEmail,
                richName: mod.financeName,
                richphone: mod.financePhone,
                richemail: mod.financeEmail,
                orgType: mod.orgType,
                orgProductTypes: mod.orgProductTypes,
                placeRight: mod.placeRight,
                placeArea: mod.placeArea,
                orgEmployees: mod.orgEmployees,
                webchoose: this.webchoose,
                mcc: this.mcc.split("|")
              });
            }
          },
          err => {
            console.log("1111");
          }
        );
      },
      handleSubmit(e) {
        e.preventDefault();
        this.form.validateFields((err, values) => {
          if (!err) {
            if (this.docking) {
              // if (!values.webchoose) {
              //   this.$message.error("网站信息至少选择一个填写！");
              //   return false;
              // }
              // console.log(this.webchoose.indexOf("A"));
              // if (
              //   this.webchoose.indexOf("A") >= 0 &&
              //   (!values.webname || !values.weburl || !values.webrecord)
              // ) {
              //   this.$message.error("网站名称,网址,ICP备案号必须填写！");
              //   return false;
              // }
              // if (
              //   this.webchoose.indexOf("B") >= 0 &&
              //   (!values.appname || !values.appaddress)
              // ) {
              //   this.$message.error("APP名称,上线应用市场必须填写！！");
              //   return false;
              // }
              // if (
              //   this.webchoose.indexOf("C") >= 0 &&
              //   (!values.pubname || !values.pubID)
              // ) {
              //   this.$message.error("公众号名称,公众号ID必须填写！！");
              //   return false;
              // }
              if (
                !values.webname &&
                !values.weburl &&
                !values.webrecord &&
                !values.appname &&
                !values.appaddress &&
                !values.pubname &&
                !values.pubID
              ) {
                this.$message.error("网站信息请至少选择一个填写！");
                return false;
              } else if (
                !values.webname &&
                !values.weburl &&
                !values.webrecord &&
                !values.appname &&
                values.appaddress.length == 0 &&
                !values.pubname &&
                !values.pubID
              ) {
                this.$message.error("网站信息请至少选择一个填写！");
                return false;
              } else {
                console.log(values.webname);
                console.log(values.weburl);
                console.log(values.webrecord);
                console.log(values.appname);
                console.log(values.appaddress);
                console.log(values.pubname);
                console.log(values.pubID);
                this.arr = [
                  values.webname,
                  values.weburl,
                  values.webrecord,
                  values.appname,
                  values.appaddress,
                  values.pubname,
                  values.pubID
                ];
                console.log("arr", this.arr, this.arr[3]);
              }
              if (this.arr[0] || this.arr[1] || this.arr[2]) {
                if (this.arr[0] && this.arr[1] && this.arr[2]) {
                } else {
                  this.$message.error("网站名称,网址,ICP备案号必须全部填写！");
                  return false;
                }
              }

              if (this.arr[3] || this.arr[4].length > 0) {
                if (this.arr[3] && this.arr[4].length > 0) {
                } else {
                  this.$message.error("APP名称,上线应用市场必须全部填写！！");
                  return false;
                }
              }

              if (this.arr[5] || this.arr[6]) {
                if (this.arr[5] && this.arr[6]) {
                } else {
                  this.$message.error("公众号名称,公众号ID必须全部填写！！");
                  return false;
                }
              }
            }
            const data = {
              id: this.infoid || "",
              websiteName: values.webname,
              websiteUrl: values.weburl,
              websiteIcp: values.webrecord, //网站ICP号
              appName: values.appname,
              appMarketplaces: values.appaddress,
              wechatPublicName: values.pubname, //公众号
              wechatPublicId: values.pubID,
              contactName: values.businessName, //业务联系人
              contactPhone: values.businessphone,
              contactEmail: values.businessemail,
              techName: values.techName, // 技术人员
              techPhone: values.techphone,
              techEmail: values.techemail,
              financeName: values.richName,
              financePhone: values.richphone,
              financeEmail: values.richemail,
              orgType: values.orgType,
              orgProductTypes: values.orgProductTypes,
              placeRight: values.placeRight,
              placeArea: values.placeArea,
              orgEmployees: values.orgEmployees,
              mcc: this.mcc
              // orgMccType: "7"
            };
            api.SpeInfoadd(
              data,
              res => {
                console.log("res", res);
                console.log(res.data);
                if (res.data.logMerchantAddRequest) {
                  let logid = JSON.stringify(res.data.logIdentityAddRequest);
                  let logms = JSON.stringify(res.data.logMerchantAddRequest);
                  sessionStorage.setItem("logid", logid);
                  sessionStorage.setItem("logms", logms);
                  console.log(logid);
                  this.$router.push({
                    path: "/SpeCustomer/step3",
                    query: { modify: true }
                  });
                } else {
                  this.doNext(2);
                }
              },
              err => {
                console.log("res", res);
              }
            );

            console.log("Received values of form: ", values);
          }
        });
      },
      doNext(step) {
        console.log(step);
        var st = step + 1;
        this.$router.push("/SpeCustomer/step" + st);
      },
      handleChange(value, selectedOptions) {
        console.log("typeChange", typeof value, value);
        console.log(selectedOptions);
        let arr = value;
        let labelarr = selectedOptions;
        this.array = [];
        if (labelarr) {
          if (labelarr.length > 0) {
            for (var i = 0; i < labelarr.length; i++) {
              this.array.push(labelarr[i].label);
            }
          }
        }
        // console.log(this.array);
        // console.log(typeof arr.join("|"), arr.join("|"));a
        this.mcc = arr.join("|");
        // this.mcc = {
        //   value: this.array.join("|"),
        //   label: arr.join("|")
        // };
        console.log(this.mcc);
      },
      onChange(e) {
        console.log("radio checked", e.target.value);
        // if (e.target.value == "b") {
        //   this.docking = false;
        // } else {
        //   this.docking = true;
        // }
      },
      webChange(checkedValues) {
        console.log("checked = ", checkedValues);
        this.webchoose = checkedValues;
        // if (arr.indexOf("A") >= 0) {
        //   this.webchoose = 'A';
        //   console.log('A')
        // } else if (arr.indexOf("B") >= 0)  {
        //   this.webchoose = 'B';
        //   console.log('B')
        // }else if  (arr.indexOf("C") >= 0) {
        //   this.webchoose = 'C'
        //   console.log('C')
        // }else{
        //   this.webchoose = ''
        // }
      },
      appchange(checkedValues) {
        console.log("checked = ", checkedValues);
        let arr = checkedValues;
        if (arr.indexOf("H1") >= 0) {
          this.isother = false;
        } else {
          this.isother = true;
        }
      },
      categoryChange(checkedValues) {
        console.log("checked = ", typeof checkedValues, checkedValues);
        let arr = checkedValues;
        // let array = [];
        // if (arr.length > 0) {
        //   for (let i=0; i<arr.length; i++) {

        //     array.push( arr[i]);
        //   }
        //   console.log(array)
        //   this.orgProductTypes = array;
        // }

        if (arr.indexOf("org_product_type_002") >= 0) {
          this.iscategory = false;
        } else {
          this.iscategory = true;
        }
      },
      validatemail(rule, value, callback) {
        const reg = new RegExp(
          "^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$"
        );
        if (value && !reg.test(value)) {
          callback("您输入的邮箱格式有误！");
          return;
        } else {
          this.emailvalue = value;
          console.log(this.emailvalue);
          callback();
        }
      },
      validateCode(rule, value, callback) {
        // let reg = new RegExp('[\\u4E00-\\u9FFF]+', 'g')
        if (value && !/^1(3|4|5|6|7|8|9)\d{9}$/.test(value)) {
          /* eslint-disable-next-line */
          this.phone = false;
          callback("您输入手机号格式有误！");
          return;
        } else {
          if (!value) {
            this.phone = false;
          } else {
            this.phone = true;
            this.phonevalue = value;
            console.log(this.phonevalue);
          }
          callback();
        }
      },
      validatenet(rule, value, callback) {
        if (value && !/^(?=^.{3,255}$)(http(s)?:\/\/)?(www\.)?[a-zA-Z0-9][-a-zA-Z0-9]{0,62}(\.[a-zA-Z0-9][-a-zA-Z0-9]{0,62})+(:\d+)*(\/\w+\.\w+)*$/.test(value)) {
          this.weburl = false;
          callback("您输入网址格式有误！");
          return;
        } else {
          callback();
        }
      },
      validateicp(rule, value, callback) {
        if (value && !/[\u4e00-\u9fa5]ICP备\d{8}号(-\d{1,3})?/.test(value)) {
          this.webrecord = false;
          callback("您输入备案号格式有误！");
          return;
        } else {
          callback();
        }
      }
    }
  };
</script>
<style lang="scss" scoped>
  .formGroupTitle {
    font-size: 20px;
    font-weight: bold;
    text-align: left;
  }

  .content {
    // text-align: center;
  }

  .row-sty {
    margin-bottom: 20px;
  }

  .card {
    margin-top: 50px;
  }

  .card .title {
    text-align: center;
    padding: 20px;
    font-size: 18px;
  }

  .btn-next {
    margin-top: 20px;
  }

  .btn-style {
    background: #ccc;
    border: 1px solid #ccc;
    color: #eee;
  }

  .ant-advanced-search-form {
    //   padding: 24px;
    //   background: #fbfbfb;
    //   border: 1px solid #d9d9d9;
    //   border-radius: 6px;
  }

  .ant-advanced-search-form .ant-form-item {
    display: flex;
  }

  .ant-advanced-search-form .ant-form-item-control-wrapper {
    flex: 1;
  }
  .submitButton {
    width: 10vw;
  }
  .baseInfo{
    width:80%;
  }
</style>